<!DOCTYPE html>
<html>
<head profile="http://dublincore.org/documents/dcq-html">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <title>qooxdoo &raquo; Welcome</title>
  <style type="text/css">

html,body{
  padding: 0;
  margin: 0;
  background: #FFFFFF;
  color: #262626;
}

body{
  font-family: "Lucida Grande", Verdana, Arial, sans-serif;
  font-size: 12px;
  line-height: 180%;
}

*{
  padding: 0;
  margin: 0;
}

.header {
  background-color: #323335;
  color: white;
  padding: 10px 40px;
  font-size: 18px;
  font-family: 'Lucida Grande', 'Verdana', sans-serif;
  border-bottom: 4px solid #3d72c9;;
}

a:link,
a:visited{
  text-decoration: underline;
  color: #444444;
}

a:hover,
a:active{
  text-decoration: underline;
  color: #3D72C9;
}

h1{
  color: white;
  font-size: 14px;
}

h2{
  color: #3D72C9;
  font-size: 14px;
}

h3{
  font-size: 12px;
  font-weight: bold;
  color: #000000;
}

h3 span{
  font-weight: bold;
  font-size: 11px;
}

p{
  margin: 12px 0;
  max-width: 800px;
}

ul{
  list-style: square;
  padding-left: 16px;
  color: #565656;
}

li{
  margin-bottom: 10px;
}

li p{
  color: black;
  margin: 0;
}

pre,
code{
  font-family: Consolas, "Bitstream Vera Sans Mono", "Courier New", monospace;
  font-size: 11px;
  line-height: 160%;
  padding: 1px 4px;

}

.main{
  background: #F0F0F0;
  padding: 16px 40px;
}

.main pre,
.main code{
  background: #FFFFFF;
}

.block pre,
.block code{
  background: #F0F0F0;
}

.block{
  width: 300px;
  margin: 16px 40px;
  margin-top: 40px;
  float: left;
}

.hide, .publish {
  display: none;
}

  </style>

  <script type="text/javascript">
  var qxversion = "2.1";

  /**
   * Replace occurrences of $(qxversion) with the value of var qxversion.
   */
  function expandVersion(s){
    while (s.indexOf('$(qxversion)') > -1) {
      s  = s.replace('$(qxversion)', qxversion);
    }
    return s;
  }

  function myOnLoad(){
    var elems = document.getElementsByName("verslink");
    for (var i=0, l=elems.length; i<l; i++){
      var e = elems[i];
      e.href = expandVersion(e.href);
    }
  }
  </script>
</head>
<body onload="myOnLoad();">

  <div class="header">qooxdoo - a universal JavaScript framework</div>
  <div class="main">
    <p>
      Welcome to the qooxdoo SDK! It is easy to create your own impressive and
      versatile applications. For detailed information on how to create such
      apps, for instance a typical rich internet application (RIA), please see
      the manual to
      <span class="local hide"><a href="documentation/manual/build/html/pages/getting_started.html">get started</a> <i>(needs generation)</i>.</span>
      <span><a href="documentation/manual/pages/getting_started.html">get started</a>.</span>
    </p>
    <p>
      For the impatient, here is a short version:
      <ul>

        <li> Use the <code>tool/bin/create-application.py</code> script to set
            up a new application.  This will create a minimal directory structure of
            an application which is ready to be built and run.
        <li> Within the newly created application folder run the command
            <code>generate.py</code> to generate a development version of your app.
        <li> Open <code>source/index.html</code> in your browser and see your
            first application in action.
        <li> You can then go on and extend it into an application of your liking by changing the
            <code>Application.js</code> class file below the <code>source/class/</code> folder.
        <li> The command <code>generate.py build</code> generates an optimized
            and compressed version of your application, located at
            <code>build/index.html</code>.
      </ul>
    </p>
    <p>
      Open the included <a href="framework/api/index.html">API viewer</a> to
      display and search the entire API reference of the framework.
      Also have a look at the
    <span class="local hide"><a href="readme.rst">readme</a></span>
    <span><a href="readme.html">readme</a></span>
    and <a href="license.txt">license text</a>.
  </p>
  </div>

  <div class="block">
    <h2>Demo Applications</h2>
    <p>Please note that the following applications, except for the
        <a href="application/showcase/build/index.html">Showcase</a>, are not
        pre-built. To create working applications</a> locally use the appropriate commands
        <code>generate.py source</code> or <code>generate.py build</code> in
        the corresponding application's directory.
    <ul>
      <li>
        <h3>Showcase <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/showcase">Online</a>)</span></h3>
        <p>Highlights some of qooxdoo's main features and provides a good overview of what can be achieved.</p>
        <a href="application/showcase/source/index.html">Source</a> <i>(needs generation)</i><br/>
        <b><a href="application/showcase/build/index.html">Build</a></b> <i>(ready to run)</i>
      </li>
      <li>
        <h3>Tutorial <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/tutorial">Online</a>)</span></h3>
        <p>Interactive tutorial app to learn the basics of qooxdoo.</p>
        <a href="application/tutorial/source/index.html">Source</a> |
        <a href="application/tutorial/build/index.html">Build</a> <i>(both need generation)</i>
      </li>
      <li>
        <h3>Widget Browser <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/widgetbrowser">Online</a>)</span></h3>
        <p>Shows the widgets and themes available in qooxdoo.</p>
        <a href="application/widgetbrowser/source/index.html">Source</a> |
        <a href="application/widgetbrowser/build/index.html">Build</a> <i>(both need generation)</i>
      </li>
      <li>
        <h3>Demo Browser <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/demobrowser">Online</a>)</span></h3>
        <p>Contains many examples and tests for widgets, layouts and other framework functionality.</p>
        <a href="application/demobrowser/source/index.html">Source</a> |
        <a href="application/demobrowser/build/index.html">Build</a> <i>(both need generation)</i>
      </li>
      <li>
        <h3>Playground <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/playground">Online</a>)</span></h3>
        <p>Explore qooxdoo programming interactively: edit qooxdoo code in one pane, and see the result running in another.</p>
        <a href="application/playground/source/index.html">Source</a> |
        <a href="application/playground/build/index.html">Build</a> <i>(both need generation)</i>
      </li>
      <li>
        <h3>Feed Reader <span>(Online: <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/feedreader">Desktop</a> | <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/feedreader-website">Website</a> | <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/feedreader-mobile">Mobile</a>)</span></h3>
        <p>A hybrid application for displaying RSS feeds, available as a RIA, a trimmed-down web site, or a mobile application (Smartphones: Android 1.6+, iOS; Desktop: Safari 5, Chrome 10+), all from the same code base.</p>
        <p><b>Desktop</b>: <a href="application/feedreader/source/index.html">Source</a> |
        <a href="application/feedreader/build/index.html">Build</a> <i>(both need generation)</i></p>
        <p><b>Website</b>: <a href="application/feedreader/source/index-website.html">Source</a> |
        <a href="application/feedreader/build-website/index.html">Build</a> <i>(both need generation)</i></p>
        <p><b>Mobile</b>: <a href="application/feedreader/source/index-mobile.html">Source</a> |
        <a href="application/feedreader/build-mobile/index.html">Build (Android)</a> |
        <a href="application/feedreader/build-mobile/index-ios.html">Build (iOS)</a> <i>(all need generation)</i><br>
      </li>
      <li>
        <h3>ToDo <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/todo">Online</a>)</span></h3>
        <p>A DOM-oriented application using offline and templating functionality.</p>
        <a href="application/todo/index.html">Source</a> <i>(needs generation)</i>
      </li>
      <li>
        <h3>Mobile Showcase <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/mobileshowcase">Online</a>)</span></h3>
        <p>An experimental showcase for mobile widgets (Smartphones: Android 1.6+, iOS; Desktop: Safari 5, Chrome 10+).</p>
        <a href="application/mobileshowcase/source/index.html">Source</a> |
        <a href="application/mobileshowcase/build-indigo/index.html">Build</a>
        <i>(all need generation)</i>
      </li>
    </ul>
  </div>

  <div class="block">
    <h2>Developer Tools</h2>
    <p>The following applications work with data from the qooxdoo framework itself.
      Versions can also be generated that are specific to your custom application.
      While the API Viewer is pre-built and runs out-of-the-box, you need to generate
      the others yourself.</p>
    <ul>
      <li>
        <h3>API Viewer <span>(Online: <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/website-api/index.html">Website</a> | <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/apiviewer/index.html">Framework</a>)</span></h3>
        <p>Searchable API reference of the qooxdoo framework.</p>
        <b><a href="component/standalone/website/api/index.html">qx.Website API</a></b> <i>(ready to run)</i><br>
        <b><a href="framework/api/index.html">Framework API</a></b> <i>(ready to run)</i>
      </li>
      <li>
        <h3>Test Runner <span>(Online: <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/website-tests/index.html">Website</a> | <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/mobile-tests/index.html">Mobile</a> | <a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/testrunner/index.html">Framework</a>)</span></h3>
        <p>Integrated unit testing framework similar to (but not requiring) JSUnit.</p>
        <a href="component/standalone/website/test/index.html">qx.Website Tests</a> <i>(needs generation)</i><br>
        <a href="framework/test-mobile/index.html">qx.Mobile Tests</a> <i>(needs generation)</i><br>
        <a href="framework/test/index.html">Framework Tests</a> <i>(needs generation)</i>
      </li>
      <li>
        <h3>Inspector <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/inspector">Online</a>)</span></h3>
        <p>A debugging tool to inspect a qooxdoo application, featuring an interactive console, an object and widget finder, and a property editor.</p>
        <a href="component/inspector/build/index.html">Inspector</a> <i>(needs generation)</i>
      </li>
      <li>
        <h3>Feature Configuration Editor <span>(<a name="verslink" href="http://demo.qooxdoo.org/$(qxversion)/featureconfigeditor">Online</a>)</span></h3>
        <p>A tool that aids developers in creating configurations for feature-based builds.</p>
        <a href="application/featureconfigeditor/build/index.html">Feature Configuration Editor</a> <i>(needs generation)</i>
      </li>
      <li>
        <h3>Manual <span>(<a name="verslink" href="http://manual.qooxdoo.org/$(qxversion)/">Online</a>)</span></h3>
        <p>The qooxdoo manual, including user guide and reference sections.</p>
        <span class="local hide"><a href="documentation/manual/build/html/index.html">Manual</a> <i>(needs generation)</i></span>
        <span><a href="documentation/manual/index.html">Manual</a> <i>(ready to use)</i></span>
      </li>
    </ul>
  </div>
</body>
</html>
